<template>
  <div class="container_detail coupon-edit">
    <div class="header">
      <p v-if="type == 'more'">定制用户管理>批量添加定制用户</p>
      <p v-else>定制用户管理>添加定制用户</p>
      <el-button class="link" type="primary">
        <router-link :to="{path:'userDesignList',query: { pageIndex: currentPage }}" style="color: #fff;">返回</router-link>
      </el-button>
    </div>
    <div class="main">
      <el-form
        :model="user"
        :rules="rules"
        ref="user"
        label-width="150px"
        class=""
       >
       <el-form-item
          v-if="type == 'more'"
          label="定制用户数量："
          prop="num"
        >
          <el-input-number style="width:220px" v-model="user.num" @change="handleChange" :min="1"></el-input-number>
        </el-form-item>
        <el-form-item
          label="余点："
          prop="price"
        >
           <el-input
              v-model="user.price"
              placeholder="请输入"
            ></el-input>
        </el-form-item>
         <el-form-item
          label="所属集团："
          prop="trueName"
        >
           <el-input
              v-model="user.trueName"
              placeholder="请输入"
            ></el-input>
        </el-form-item>
        <el-form-item
          label="有效期："
          prop="validTime"
        >
             <el-date-picker
              value-format="yyyy-MM-dd HH:mm:ss"
                v-model="user.validTime"
                type="date"
                placeholder="选择日期">
            </el-date-picker>
        </el-form-item>
        <el-form-item
          label="使用范围描述："
          prop="price"
        >
            <el-transfer 
             style="margin-bottom:30px"
             :titles="['公开商品', '限定范围']"
             v-model="goodsSelect" :data="goodsArr"></el-transfer>
             <el-transfer 
             :titles="['非公开商品', '限定范围']"
             v-model="noOpenSelect" :data="noOpenGoodsArr"></el-transfer>
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary" :loading="loading1"
                @click="handleSave('user')"
                style="margin-left:150px"
            >保存</el-button>
          <el-button class="link" type="primary">
            <router-link :to="{path:'couponList',query: { pageIndex: currentPage }}" style="color: #fff;">返回</router-link>
        </el-button>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>

<script>
let CONSTANT = require("../../constant/constant.js");
let common = require("../../common.js");
let countryArr = require("../../../static/city.json");
export default {
  data() {
    return {
      id: "",
      info: "",
      // 返回 导航页码
      currentPage: 1,
      dialogVisible: false,
      user: {
        "type": "special",
        "id": "",
        "num":"",
        "price":'',
        "trueName": "",
        "validTime": "",
        "yUseRangeGoodsId": "",
        "nUseRangeGoodsId": ""
        },
      rules: {
        price: [{ required: true, message: "请输入余点", trigger: "blur" }],
        validTime: [
          { required: true, message: "请选择有效期", trigger: "blur" }
        ],
        trueName: [
          { required: true, message: "请输入集团名", trigger: "blur" }
        ]
      },
      content:"",
      type:'',
      goodsSelect:[],
      noOpenSelect:[]
      ,goodsArr:[],
       noOpenGoodsArr:[],
      type:'',
      loading1:false
    };
  },
  mounted() {
      this.type = this.$router.currentRoute.query.type;
    this.id = this.$router.currentRoute.query.id;
    this.currentPage = this.$router.currentRoute.query.pageIndex
      ? this.$router.currentRoute.query.pageIndex
      : 1;
    this.getGoods()
    this.getnoOpenGoods()
    if(this.id){
      this.getDetail();
    }
  },
  methods: {
      getGoods: function() {
        let url = CONSTANT.URL.LIST.findEsGoodsByPage;
        let data = {
            pageIndex: 1,
            pageSize:1000,
            isOpen:'y'
        };
        this.loading = true;
        common.requestAjax(url, JSON.stringify(data), null, res => {
            let data = res.data.bussData;
            data.map(item=>{
                this.goodsArr.push({
                    key:item.id,
                    label:item.goodsName
                })
            })
        });
      },
      getnoOpenGoods: function() {
        let url = CONSTANT.URL.LIST.findEsGoodsByPage;
        let data = {
            pageIndex: 1,
            pageSize:1000,
            isOpen:'n'
        };
        this.loading = true;
        common.requestAjax(url, JSON.stringify(data), null, res => {
            let data = res.data.bussData;
            data.map(item=>{
                this.noOpenGoodsArr.push({
                    key:item.id,
                    label:item.goodsName
                })
            })
        });
      },
     getDetail() {
      let url = CONSTANT.URL.LIST.findEsCouponById;
      let data = { id: this.id }
      common.requestAjax(url, JSON.stringify(data), null, res => {
        let data = res.data.bussData;
        let arr=[],arr1=[]
        data.useBrandDTO.map(item=>{
            arr.push(item.id)
        })
        data.useCategoryDTO.map(item=>{
            arr1.push(item.id)
        })
        if(arr.length){
           this.brandSelect = arr
           data.useRangeBrandId =  arr.join(',')
        }
        if(arr1.length){
          this.sortSelect = arr1
          data.useRangeCategoryId =  arr1.join(',')
        }
        this.user= {
            "couponName": data.couponName,
            "id":data.id,
            "num":data.num,
            "price":data.price,
            "type": data.type,
            "useRangeBrandId": data.useRangeBrandId,
            "useRangeCategoryId": data.useRangeCategoryId,
            "useRangeDetail": data.useRangeDetail,
            "validTime": data.validTime
        }
      });
    },
    handleSave: function(formName) {
      this.loading1 = true
      if(this.goodsSelect.length){
          this.user.yUseRangeGoodsId = this.goodsSelect.join(',')
      }
      if(this.noOpenSelect.length){
          this.user.nUseRangeGoodsId = this.noOpenSelect.join(',')
      }
      if(this.user.validTime){
        this.user.validTime = this.user.validTime.split(' ')[0]+' '+'23:59:58'
      }
      this.$refs[formName].validate(valid => {
        if (valid) {
          let url = CONSTANT.URL.LIST.saveEsShopUserCore;
          common.requestAjax(url, JSON.stringify(this.user), null, res => {
             this.loading1 = false
            if (res.status == 200) {
              this.$message({
                type: "success",
                message: "操作成功!"
              });
              this.$router.push({
                path: "/userDesignList",
                query: { pageIndex: this.currentPage }
              });
            } else {
              this.$message({
                type: "warning",
                message: res.msg
              });
            }
          });
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    }
  }
};
</script>
<style lang="scss">
.coupon-edit {
  .el-form-item {

    
  }
    .el-input {
      width:220px;
    }
    .el-select {
      width: 220px;
      .el-input {
        width: 100%;
      }
    }

  .item-value {
    .el-input {
      width:220px;
    }
    .el-select {
      width: 220px;
      .el-input {
        width: 100%;
      }
    }
  }
}
</style>

